<template>
	<view style="position: relative; z-index: 999;" id="tabbar">
		<up-tabbar :value="props.current" activeColor="#000000" inactiveColor="#999999">
			<up-tabbar-item text="首页" @click='changeRouter(0)'>
				<template #active-icon>
					<image style="width: 40rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/01.png"></image>
				</template>
				<template #inactive-icon>
					<image style="width: 40rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/0.png"></image>
				</template>
			</up-tabbar-item>
			<up-tabbar-item text="公告" @click='changeRouter(1)'>
				<template #active-icon>
					<image style="width: 40rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/02.png"></image>
				</template>
				<template #inactive-icon>
					<image style="width: 40rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/1.png"></image>
				</template>
			</up-tabbar-item>
			<!-- 	<up-tabbar-item text="服务" @click='changeRouter(2)'>
				<template #active-icon>
					<image style="width: 36rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/03.png"></image>
				</template>
				<template #inactive-icon>
					<image style="width: 36rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/2.png"></image>
				</template>
			</up-tabbar-item>
			<up-tabbar-item text="智能机器人" @click='changeRouter(3)'>
				<template #inactive-icon>
					<image style="width: 42rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/3.png"></image>
				</template>
			</up-tabbar-item> -->
			<up-tabbar-item text="我的" @click='changeRouter(2)'>
				<template #active-icon>
					<image style="width: 38rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/05.png"></image>
				</template>
				<template #inactive-icon>
					<image style="width: 38rpx;height: 40rpx;"
						src="https://mall-admin.xinjiafu.net/mini-static/images/tabbar/4.png"></image>
				</template>
			</up-tabbar-item>
		</up-tabbar>
	</view>
</template>

<script setup>
	import {
		msg,
		redirectTo
	} from "@/utils/tool.js"
	import login from "@/common/login.js"

	const props = defineProps({
		current: {
			type: Number,
			default: 0
		}
	})

	// 路由
	const routerMap = new Map([
		[0, "/pages/index/index"],
		[1, "/pages/announcement/index"],
		[2, "/pages/mine/index"],
	])

	// 跳转
	const changeRouter = async index => {
		login().then(() => {
			if (!routerMap.has(index)) {
				msg("暂未开发，敬请期待")
			} else {
				redirectTo(routerMap.get(index))
			}
		})
	}
</script>

<style lang="scss" scoped>
</style>